import React from "react";
import { Result, Button } from "antd";
import { useRouteError, ErrorResponse, useNavigate } from "react-router-dom";

const ErrorPage: React.FC = () => {
  const error = useRouteError() as ErrorResponse & Error;
  const navigate = useNavigate();
  return (
    <>
      <Result
        status="404"
        title="404"
        subTitle={error.statusText || error.message}
        extra={
          <Button
            type="primary"
            onClick={() => {
              navigate("/layout/tab1");
            }}
          >
            Back Home
          </Button>
        }
      />
    </>
  );
};

export default ErrorPage;
